String.prototype.stripslashes = function () {
    var str = this;
    str = str.replace(/\\'/g, '\'');
    str = str.replace(/\\"/g, '"');
    str = str.replace(/\\0/g, '\0');
    str = str.replace(/\\\\/g, '\\');
    return str;
};

$(function () {
    $(".Dialog .Layout").on("click", function () {
        new Dialog().close();
    });

    IsMobile(function (value) {
        if (value) {
            var previousScroll = 0;
            $(window).scroll(function () {
                var currentScroll = $(this).scrollTop();
                if (currentScroll > previousScroll) {
                    if (currentScroll > 70)
                        $("#headerbar,#ms-footer").fadeOut();
                } else {
                    $("#headerbar,#ms-footer").fadeIn();
                }
                previousScroll = currentScroll;
            });
        }
    });

});


var App = {
    Base_Api: "",
    Base_Url: "",
    Base_Upload: "",
    setSession: function (key, value, success, error) {
        $.ajax({
            type: 'get',
            url: App.Base_Url + 'create-variable?var=' + key + '&data=' + value,
            success: function () {
                if (typeof success == 'function') {
                    success();
                }
            }, error: function (a, b) {
                if (typeof error == 'function') {
                    error(a, b);
                }
            }
        });
    },
    getSession: function (key, success, error) {
        $.ajax({
            type: 'get',
            url: App.Base_Url + 'get-variable?var=' + key,
            success: function (data) {
                if (typeof success == 'function') {
                    success(data);
                }
            }, error: function (a, b) {
                if (typeof error == 'function') {
                    error(a, b);
                }
            }
        });
    },
    soundEffect: function (filename) {
        var audio = new Audio(App.Base_Url + 'public/sound/' + filename + '.mp3');
        audio.play();
    },
    Timestamp: {
        getDateTime: function () {
            return Math.round((new Date()).getTime() / 1000);
        },
        getDateTimeMilliseconds: function () {
            return new Date().getTime();
        }
    },
    mobileDetect: function () {
        var checker = {
            iphone: navigator.userAgent.match(/(iPhone|iPod|iPad)/),
            blackberry: navigator.userAgent.match(/BlackBerry/),
            android: navigator.userAgent.match(/Android/),
            windowphone: navigator.userAgent.match(/Windows Phone/),
            moto: navigator.userAgent.match(/MOTOROLA/),
            Windows: navigator.userAgent.match(/IEMobile/),
            Nokia: navigator.userAgent.match(/Nokia/),
            opera: navigator.userAgent.match(/Opera Mini/)
        };
        if (checker.android) {
            return "android";
        } else if (checker.iphone) {
            return "ios";
        } else if (checker.blackberry) {
            return "blackberry";
        } else if (checker.windowphone) {
            return "windowphone";
        } else if (checker.moto) {
            return "moto";
        } else if (checker.Windows) {
            return "windows";
        } else if (checker.opera) {
            return "opera";
        } else {
            return "other";
        }
    }

};
App.applicationOs = App.mobileDetect();

var TextPanel = {
    init: function () {
        $(".Panel_Cancel").on("tap", function () {
            $(".UI_TextPanel textarea").val("");
            TextPanel.close();
        });

        $(".UI_TextPanel button").UI_AddClassHover("hover");

    },
    isOpen: function () {
        return $(".UI_TextPanel").is(":visible");
    },
    close: function () {
        $(".UI_TextPanel").hide();
    },
    show: function (done) {
        $(".UI_TextPanel").show();
        if (typeof done == 'function') {
            done();
        }
    }
}


var Dialog = function () {
    this.showPoster = function (options) {
        IsMobile(function (value) {
            if (value) {
                $("body").css({overflow: "hidden"});
            } else {
                $("#content").css({overflow: "hidden"});
            }
        });

        var html = '<div class="Poster zoomIn animated">\n\
                        <div class="image" style="background: url(' + options.poster + ') no-repeat"></div>\n\
                        <div class="info">\n\
                            <div class="logo" style="background: url(' + options.channel_logo + ') no-repeat"></div>\n\
                            <div class="schedule"><span class="icon-clock"></span>' + options.time + '</div>\n\
                        </div>\n\
                    </div>';
        $(".Dialog .Inner").html(html).parent().show();
    };
    this.close = function () {
        $(".Dialog .Inner").empty().parent().fadeOut();
        IsMobile(function (value) {
            if (value) {
                $("body").css({overflow: "auto"});
            } else {
                $("#content").css({overflow: "auto"});
            }
        });
    };

    this.show = function (options) {
        IsMobile(function (value) {
            if (value) {
                $("body").css({overflow: "hidden"});
            } else {
                $("#content").css({overflow: "hidden"});
            }
        });

        var params = {
            headerText: "Header text",
            content: "Dialog content",
            width: 200,
            height: 200
        };
        $.extend(params, options);
        var html = '\n\
        <div class="popup-dialog zoomIn animated"">\n\
                <button class="btn btn-close-dialog"></button>\n\
                <div class="dialog-header">' + params.headerText + '</div>\n\
                <div class="dialog-body">' + params.content + '</div>\n\
        </div>';
        $(".Dialog .Inner").html(html).parent().show();

    };
};

var UI_Dialog = {
    IsShow: false,
    effectIn: "",
    effectOut: "",
    showConfirm: function (options) {
        if (!this.IsShow) {
            this.IsShow = true;
            var params = {
                title: "Dialog header",
                content: "Dialog content",
                buttons: [{
                        id: "Confirm_ok",
                        text: "Ok",
                        type: "bold"
                    }],
                effectIn: "ZoomIn_3",
                effectOut: "ZoomOut_4",
                width: "280px",
                height: "158px",
                event: ""
            };
            $.extend(params, options);
            this.effectIn = params.effectIn;
            this.effectOut = params.effectOut;

            var buttons = '';
            var length = 0;
            $.each(params.buttons, function (i, item) {
                length++;
                var type = (item.type !== undefined ? item.type : '');
                buttons += "<button class='" + type + "' id='" + item.id + "'>" + item.text + "</button>";
            });

            var html = '<div class="UI_Dialog UI_Dialog_' + App.applicationOs + ' modal"><div class="UI_Dialog_layout"></div>\n\
    <div class="UI_Dialog_content" style="width:' + params.width + ';height:' + params.height + '"><div class="modal-dialog ' + params.effectIn + '">\n\
        <div class="modal-content" >\n\
            <div class="modal-header">\n\
                <h4 class="modal-title">' + params.title + '</h4>\n\
            </div>\n\
            <div class="modal-body">' + params.content + '</div>\n\
            <div class="modal-footer Button_' + length + '">' + buttons + '</div>\n\
        </div></div><!-- /.modal-content -->\n\
    </div><!-- /.modal-dialog -->\n\
</div><!-- /.modal -->';
            $("body").append(html);
            if (typeof params.event == 'function')
                params.event();

            setTimeout(function () {
                $(".UI_Dialog").removeClass(params.effectIn);
            }, 300);

            $(".UI_Dialog_layout, #Confirm_cancel").on("click", function () {
                UI_Dialog.close();
            });

        }
    }
    , close: function (success) {
        this.IsShow = false;
        $(".modal-dialog").addClass(this.effectOut);
        $(".UI_Dialog_layout").css("opacity", "0");
        setTimeout(function () {
            $(".UI_Dialog").remove();
            if (typeof success == 'function') {
                success();
            }
        }, 300);

    }
};

var Status = new function () {
    this.lateText = "";
    this.push = function (text) {
        if ($(".status .before").length == 0) {
            run(text);
        } else {
            this.lateText = text;
        }

        function run(text) {
            var textW = $(".status .text").width();
            $(".status").width(textW);

            $(".statusbar .status .text").addClass("before");
            var w = $(".before").width();
            $(".statusbar .status .hidden").append('<div class="text current" style="transform:translateX(' + (w + 30) + 'px);-webkit-transform:translateX(' + (w + 30) + 'px)"><span>' + text + '</span></div>');

            setTimeout(function () {
                $(".before").css({
                    transform: 'translateX(-' + w + 'px)', transition: 'linear 5s',
                    '-webkit-transform': 'translateX(-' + w + 'px)', '-webkit-transition': 'linear 5s'
                });
                $(".current").css({
                    transform: 'translateX(0px)', transition: 'linear 5s',
                    '-webkit-transform': 'translateX(0px)', '-webkit-transition': 'linear 5s'
                });
                setTimeout(function () {
                    $(".before").remove();
                    $(".current").removeClass("current").addClass("flash animated");

                    var textW = $(".status .text").width();
                    $(".status").width(textW);
                    var statusbarW = $(".statusbar").width() - 40;
                    if ($(window).width() <= 360 && textW >= statusbarW) {
                        setTimeout(function () {
                            $(".status .text").width(statusbarW);
                            $(".status .text span").addClass("marquee_slow");
                        }, 1200);
                    }

                    if (Status.lateText != "") {
                        setTimeout(function () {
                            run(Status.lateText);
                            Status.lateText = "";
                        }, 500);
                    }
                }, 5000);
            }, 300);
        }

    };
};

var IsMobile = function (success) {
//    var checker = {
//        mobile: navigator.userAgent.match(/(iPhone|iPod|iPad|BlackBerry|Android|Windows Phone|MOTOROLA|IEMobile|Nokia|Opera Mini)/)
//    };
    // if (checker.mobile) {
    if ($(window).width() <= 800) {
        success(1);
    } else {
        success(0);
    }
};

var GetListMenu = function (user_id, role) {
    Toast.progress({});
    var params = (role == "member" ? "?user_id=" + user_id : "");
    $.ajax({
        url: App.Base_Api + "list-show" + params,
        timeout: 15000,
        async: false, // <-- This is the key    
        success: function (data) {
            var data = data.data;
            var li = "";
            for (var i = 0; i < data.length; i++) {
                var href = data[i].starting == 1 ? 'href="' + App.Base_Url + "chuong-trinh/" + data[i].name_ascii + '.html"' : "";
                var followed = (data[i].follow == 1 ? '<button data-key="menu_' + data[i].id + '" data-id="' + data[i].id + '" class="btn btn-unfollow"></button>' : '<button data-key="menu_' + data[i].id + '" data-id="' + data[i].id + '" class="btn btn-follow"></button>') + "<div id='Preload_menu_" + data[i].id + "' class='Preload'><div class='Preload_inner'></div></div>";
                var live = data[i].starting == 1 ? "<div class='schedule playing'>Đang tương tác</div>" : "<div class='schedule'><span class='icon-clock'></span>" + data[i].schedule + "</div>";
                li += "<li data-d="+data[i].follow+">\n\
                        <a " + href + ">\n\
                        <div class='relative'>\n\
                            " + followed + "\n\
                            <div class='image' style='background: url(" + App.Base_Upload + data[i].avatar_wap + ")'></div>\n\
                            <div class='info'>\n\
                                <div class='logo' style='background: url(" + App.Base_Upload + data[i].logo + ") no-repeat'></div>\n\
                                " + live + "\n\
                            </div>\n\
                        </div>\n\
                    </a>\n\
                   </li>";
            }

            $(".MenuChannel").html("<ul>" + li + "</ul>");
            setTimeout(function () {
                Toast.progressNext();
            }, 500);
        }
    });
};

